<template>
  <div id="app">
    <img :src="imgSrc" alt="">
    <button @click="fn">你谁</button>
    <button @click="fn(1)">卧室恁爹</button>

    <p>{{msg}}</p>
        <button @click="fn2">点击翻转</button>
       <div>
         <!-- 下拉菜单 -->
         <span>来自于</span>
         <select v-model="from">
           <option value="北京市">北京</option>
           <option value="上海市">上海</option>
           <option value="长沙市">长沙</option> 
         </select>

         <!-- 复选框 -->
         <span>爱好：</span>
         <input type="checkbox" v-model="hobby" value ="抽烟">抽烟
         <input type="checkbox" v-model="hobby" value ="烫头">烫头
         <input type="checkbox" v-model="hobby" value ="喝酒">喝酒
         
         <!-- 单选框 -->
         <span>性别</span>
         <input type="radio" v-model="gender" name="sex" value="男">男
         <input type="radio" v-model="gender" name="sex" value="女">女

         <!-- 文本框 -->
         <span>自我介绍</span>
         <textarea v-model="intro"></textarea>  
      </div> 

 
  </div>
</template>

<script>
export default {
  data() {
    return {
      from: "",
      hobby: [],
      gender: "男",
      intro: "",

      msg: "vue对我好一点球球了",
      imgSrc: "https://inews.gtimg.com/newsapp_bt/0/13434330753/1000"
    };
  },
  methods: {
    fn(one) {
      console.log(one);
    },
    fn2() {
      let num = this.msg.split("");
      // console.log(num);
      let arr = num.reverse();
      // console.log(arr);
      this.msg = arr.join("");
    }
  }
};
</script>

<style>
</style>
